<!DOCTYPE html>
<html lang="en">

<head>

  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
  <!--favicon -->
  <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no">
  <link rel="apple-touch-icon" sizes="180x180" href="../css/favicon/apple-touch-icon.png">
  <link rel="icon" type="image/png" sizes="32x32" href="../css/favicon/favicon-32x32.png">
  <link rel="icon" type="image/png" sizes="16x16" href="../css/favicon/favicon-16x16.png">
  <link rel="manifest" href="../css/favicon/site.webmanifest">
  <link rel="mask-icon" href="../css/favicon/safari-pinned-tab.svg" color="#5bbad5">
  <meta name="msapplication-TileColor" content="#da532c">
  <meta name="theme-color" content="#ffffff">
    
  <style>
      body{
          margin: 0;
      }  
  </style>

  <title>Lecture 4.4</title>
</head>

<body>
    <script type="module">
        import { Game } from './Game.js';

        document.addEventListener("DOMContentLoaded", () => {
            const game = new Game(); 
            window.game = game;
            ani()
        });
        
        function ani(){ 
            game.render();
            requestAnimationFrame(ani)

        }  
        </script>
</body>

</html>
